<template>
    <div>
        <el-container>
            <el-aside width="auto" ref="aside">
                <Aside
                @posttitle="gettitle"
                :isCollapse="isCollapse"
                
                :list="list"
                ></Aside>
            </el-aside>
            <el-container style="height: 100%;width=auto">
            <!-- :username="user.userName" -->
                <el-header ref="header" style="height: 100px">
                <Header
                    :title="title"
                
                    @postcollapse="getcollapse"
                ></Header>
                </el-header>
                <el-main ref="main">
                     <el-form-item>
                        <el-form-item>
                            <el-input placeholder="请输入搜索条件" v-model="searchTitle"></el-input>
                        </el-form-item>
                        <el-button type="primary" @click="getListData" style="margin-left:10px">查询</el-button>
                    </el-form-item>
                    <el-table :data="listData" border>
                        <el-table-column type="index" label="序号" width="100"></el-table-column>
                        <el-table-column prop="username" label="姓名" ></el-table-column>
                        <el-table-column prop="sex" label="性别" >
                             <template #default="scope">
                                <p>{{scope.row.sex==0?'男':'女'}}</p>
                            </template>
                        </el-table-column>
                        <el-table-column prop="checkItemName" label="检查名称" ></el-table-column>
                        <el-table-column prop="part" label="部位" ></el-table-column>
                        <el-table-column prop="departmentName" label="科室名" ></el-table-column>
                        <el-table-column prop="result" label="检查结果" ></el-table-column>
                        <el-table-column prop="payStatus" label="状态" >
                             <template #default="scope">
                                <p v-if="scope.row.payStatus==0">未执行</p>
                                <p v-if="scope.row.payStatus==1">已执行</p>
                                <p v-if="scope.row.payStatus==2">已取消执行</p>   
                            </template>
                        </el-table-column>
                        <el-table-column prop="checkTime" label="检查时间" ></el-table-column>
                        <el-table-column label="操作" width="150" align="center">
                        <template #default="scope">
                            <el-button size="small" type="success" @click="handleEdit(scope.$index, scope.row)">录入结果
                            </el-button>
                        </template>
                        </el-table-column>
                    </el-table>
                </el-main>
            </el-container>
           
        </el-container>
        
    </div>
   
   
    
</template>
<script type="text/javascript">
import Aside from "@/components/Aside.vue";
import Header from "@/components/Header.vue";
import request from "@/utils/forward/request";
       export default {
        components: {
            Aside,
            Header,
        },
        name: "index",
        data() {
            return {
               title: "病人列表-首页",
                // 用户对象
                user: {
                    user_id: 2,
                    user_name: "凤文",
                },
                // 侧边栏是否折叠
                isCollapse: false,
                // 类型

                //   侧边栏数据,包括名称、路由、图标
                list: [
                    { name: "挂号列表", url: "index"},
                    { name: "检查项目管理" },
                    { name: "检查项目套组管理" },
                    { name: "处方项目管理" },
                    { name: "处方项目套组管理" },
                ],
                searchTitle:'', //搜索条件
                listData:[], //列表数据
                totalRecords:10,
            };
        },
        methods:{
            gettitle(val) {
                this.title = val;
            },

            getcollapse(val) {
             this.isCollapse = val;
            },

            // 获取列表数据
            getListData(){
                var data={
                    title:this.searchTitle
                }
                request(
                    "get",
                    "his/check/list",
                    data
                ).then((res) => {
                    this.totalRecords = res.result.total;
                    this.listData = res.result;
                });
            },
            // 编辑
            handleEdit(index,row){
                
                this.$prompt('请输入结果', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    }).then(({ value }) => {
                        var data={
                            checkItemId:row.checkItemId,
                            result:value
                        }
                        request(
                            "put",
                            "his/check",
                            data
                        ).then((res) => {
                             this.$message.success('操作成功')
                             this.getListData()
                        });
                    })
            }
        },
        mounted(){
            this.getListData()
        },

        watch: {
            // 控制侧边栏是否折叠
            isCollapse() {
                if (this.isCollapse) {
                    this.$refs.main.$el.style.marginLeft = "65px";
                    this.$refs.header.$el.style.marginLeft = "65px";
                } else {
                    this.$refs.main.$el.style.marginLeft = "200px";
                    this.$refs.header.$el.style.marginLeft = "200px";
                }
            },
         },
        };
</script>